<template>
    <div class="opinion">
        <div class="box">
            <div class="ter">
                <div class="text">
                    <x-textarea placeholder="提出您的宝贵意见" v-model="value" :max="300" :height="180"></x-textarea>            
                </div>
            </div>
            <div class="btn">
                <button class="f30" @click="feedback()">意见反馈</button>
            </div>
        </div>
    </div>
</template>

<script>
    import { XTextarea } from 'vux'
    export default {
        name: 'opinion',
        components: {
            XTextarea
        },
        data() {
            return {
                value: '',
            }
        },
        methods: {
            feedback() {
                if(this.value.length > 0) {
                    let params = {}
                    if(this.$store.state.isMaster) {
                        params = {
                            content: this.value,
                            userId: this.$store.state.userId,
                        }
                    } else {
                        params = {
                            content: this.value,
                            userId: this.$store.state.userId,
                            marsterId: this.$store.state.marsterId,
                        }
                    }
                    this.$http.fetchGet('AddUseridea', params).then(res => {
                        if(res.code == 200) {
                            this.$vux.toast.text('反馈成功')
                            this.$router.push({
                                path: '/my'
                            })
                        } else {
                            this.$vux.toast.text(res.msg)
                        }
                    }, err => {
                        console.log(err)
                    })
                } else {
                    this.$vux.toast.text('请输入内容')
                } 
            }    
        },
        mounted() {

        }
    }
</script>

<style lang="less" scoped>
    .opinion{
        position: absolute;
        top: 0;
        bottom: 0;
        width: 100%;
        background: #f2f2f2;
        box-sizing: border-box;
        .box{
            width: 100%;
            .text{
                .m(20);
                background: #fff;
                border-radius: 5px;
                overflow: hidden;
                .ter{
                    width: 100%;
                    background: #fff;
                    box-sizing: border-box;
                    border-radius: 5px;
                }
            }
            .btn{
                box-sizing: border-box;
                width: 100%;
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                .p(20);
                button{
                    width: 100%;
                    .h(88);
                    border: none;
                    background: #189BEB;
                    border-radius: 5px;
                    color: #fff;
                }
            }  
        }
        
    }
</style>
